﻿@page "/Test2"


<MatAccordion>
    <MatExpansionPanel @bind-Expanded="@panelOpenState" HideToggle="true">
        <MatExpansionPanelSummary>
            <MatExpansionPanelHeader>Self aware panel</MatExpansionPanelHeader>
            <MatExpansionPanelSubHeader>
                Currently I am @(panelOpenState ? "open" : "closed")
            </MatExpansionPanelSubHeader>
        </MatExpansionPanelSummary>
        <MatExpansionPanelDetails>
            <p>I'm visible because I am open</p>
        </MatExpansionPanelDetails>
    </MatExpansionPanel>

    <MatExpansionPanel>
        <MatExpansionPanelSummary>
            <MatExpansionPanelHeader>Personal data</MatExpansionPanelHeader>
            <MatExpansionPanelSubHeader>Type your name and age</MatExpansionPanelSubHeader>
        </MatExpansionPanelSummary>
        <MatExpansionPanelDetails>
            <MatStringField Label="First name"></MatStringField>
            <MatStringField Label="Age"></MatStringField>
        </MatExpansionPanelDetails>
    </MatExpansionPanel>

</MatAccordion>


@code
{
    bool panelOpenState;
}